<template>
  <a-modal
    :title="title"
    width="65%"
    :visible="visible"
    :confirmLoading="loading"
    @ok="handleSubmit(ServiceItemsSelectedRowKeys)"
    @cancel="
      () => {
        this.visible = false
      }
    "
  >
    <a-spin :spinning="loading">
      <a-form-model ref="form" :model="entity" :rules="rules" v-bind="layout">
        <a-form-model-item label="查询类别">
          <div class="table-page-search-wrapper">
            <a-form layout="inline">
              <a-row :gutter="10">
                <a-col :md="5" :sm="24">
                  <a-form-item label="">
                    <a-select allowClear v-model="queryParam.condition">
                      <a-select-option key="Number">服务项目编码</a-select-option>
                      <a-select-option key="Name">服务项目</a-select-option>
                      <a-select-option key="Content">服务详细内容</a-select-option>
                      <a-select-option key="AccountName">科目名称</a-select-option>
                    </a-select>
                  </a-form-item>
                </a-col>
                <a-col :md="5" :sm="24">
                  <a-form-item>
                    <a-input v-model="queryParam.keyword" placeholder="关键字" />
                  </a-form-item>
                </a-col>
                <a-col :md="6" :sm="24">
                  <a-button
                    type="primary"
                    @click="
                      () => {
                        this.pagination.current = 1
                        this.getDataList()
                      }
                    "
                    >查询</a-button
                  >
                  <a-button
                    style="margin-left: 8px"
                    @click="
                      () => {
                        this.queryParam.keyword = ''
                        this.getDataList()
                      }
                    "
                    >重置</a-button
                  >
                </a-col>
              </a-row>
            </a-form>
          </div>
        </a-form-model-item>
        <a-form-model-item label="服务项目" prop="ServiceItems">
          <a-table
            ref="ServiceItemsTable"
            :columns="ServiceItemsColumns"
            :rowKey="(row) => row.ServiceItemId"
            :dataSource="data"
            :pagination="pagination"
            :loading="loading"
            :rowSelection="{ selectedRowKeys: ServiceItemsSelectedRowKeys, onChange: onServiceItemsSelectChange }"
            :bordered="true"
            size="small"
          >
            <span slot="action" slot-scope="text, record">
              <template>
                <a @click="handleServiceItemsEdit(record.Id)" v-if="entity.State == 0"></a>
                <!-- <a-divider type="vertical" v-if="entity.State == 0" />
                <a @click="handleServiceItemsDelete([record.Id])" v-if="entity.State == 0">删除</a> -->
              </template>
            </span>
          </a-table>
        </a-form-model-item>
      </a-form-model>
    </a-spin>
  </a-modal>
</template>

<script>
import store from '@/store'
import { stringify } from 'querystring'

const ServiceItemsColumns = [
  { title: '服务项目编码', dataIndex: 'Number', width: '15%' },
  { title: '服务项目', dataIndex: 'Name', width: '15%' },
  { title: '服务详细内容', dataIndex: 'Content', width: '20%' },
  { title: '项目单价', dataIndex: 'Price', width: '15%' },
  { title: '科目名称', dataIndex: 'AccountName', width: '15%' },
  { title: '操作', dataIndex: 'action', scopedSlots: { customRender: 'action' } },
]

var serviceItems = []

export default {
  props: {
    parentObj: Object,
  },
  data() {
    return {
      layout: {
        labelCol: { span: 5 },
        wrapperCol: { span: 18 },
      },
      visible: false,
      loading: false,
      entity: {},
      rules: {},
      title: '',
      rules: {
        // Name: [{ required: true, message: '必填' }],
      },
      ServiceItemsSelectedRowKeys: [],
      ServiceItemsColumns,
      queryParam: {},
      pagination: {
        current: 1,
        pageSize: 10,
        showTotal: (total, range) => `总数:${total} 当前:${range[0]}-${range[1]}`,
      },
      filters: {},
      sorter: { field: 'Id', order: 'asc' },
      data: [],
    }
  },
  methods: {
    init() {
      this.visible = true
      this.entity = {}
      this.$nextTick(() => {
        this.$refs['form'].clearValidate()
      })
    },
    getDataList() {
      this.loading = true

      var param = {
        PageIndex: this.pagination.current,
        PageRows: this.pagination.pageSize,
        SortField: this.sorter.field || 'Id',
        SortType: this.sorter.order,
        Search: this.queryParam,
        ...this.filters,
      }

      console.log(JSON.stringify(param))
      this.$http.post('/GBT_Manage/GBT_ServiceRequest/GetServiceItemList', param).then((resJson) => {
        console.log('服务项目：', resJson)
        this.loading = false
        this.data = resJson.Data
      })
    },
    openForm(obj, title) {
      this.init()
      console.log('服务项目：', obj)
      if (obj) {
        this.queryParam.departmentID = obj.ids
        this.queryParam.requestId = obj.RequestId
        this.queryParam.AccountId = obj.AccountId
        serviceItems = obj.ServiceItems
        this.getDataList()
      }
    },
    handleSubmit(selectedRowKeys) {
      this.$refs['form'].validate((valid) => {
        if (!valid) {
          return
        }
        Array.prototype.getIndexByValue = function (arr) {
          for (var i = 0; i < this.length; i++) {
            if (this[i].Number == arr) {
              return i
            }
          }
          return -1 //没找到则返回-1
        }
        this.loading = true
        var list = this.data
        var selectedList = []
        this.loading = false
        this.visible = false
        let item = {}
        let index = -1
        list.forEach((element) => {
          if (selectedRowKeys.indexOf(element.ServiceItemId) > -1) {
            if (serviceItems) {
              index = serviceItems.getIndexByValue(element.Number)
            }
            if (index > -1) {
              item = serviceItems[index]
            } else {
              item = {}
              item.Number = element.Number
              item.Name = element.Name
              item.DepartmentId = element.DepartmentId
              item.Quantity = 1
              item.Price = element.Price
              item.ServiceItemId = element.ServiceItemId
            }
            item.Amount = item.Quantity * item.Price
            selectedList.push(item)
          }
        })

        this.parentObj.getServiceItems(selectedList)
      })
    },
    onServiceItemsSelectChange(selectedRowKeys) {
      this.ServiceItemsSelectedRowKeys = selectedRowKeys
    },
    handleServiceItemsEdit(id) {},
    handleServiceItemsDelete(id) {},
  },
}
</script>
